@charset "utf-8";

/****************************** Normalize ******************************/
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, ul, ol, li, dl, dd, input, button, textarea, fieldset, legend, figure, menu, th, td, pre{margin:0;padding:0;}
body{font-size: 12px;font-family: "Arial", "Microsoft YaHei";color: #666;background: #000;}
h1, h2, h3, h4, h5, h6{font-weight: normal;font-size: inherit;}
a{color: #999;text-decoration: none;outline: none;}
img{border: none;}
ul, ol{list-style: none;}
i, em{font-style: normal;}
input, button, select, textarea, optgroup{font: inherit;color: inherit;outline:none;}
input[type="text"], input[type="password"], input[type="search"], button, textarea{border: 1px solid #ccc;}
input[type="button"], input[type="reset"], input[type="submit"], button{border: none;cursor:pointer;background: none;}
input[type="radio"], input[type="checkbox"]{border: none;padding:0}
input::-ms-clear, input::-ms-reveal{display: none;}
button[disabled], input[disabled]{cursor:default}
button::-moz-focus-inner, input::-moz-focus-inner{padding:0;border:0}
legend{padding:0;border:0}
textarea{resize: none;}
table{border-collapse: collapse;}
td,th{padding:0}


/****************************** Global Style ******************************/
.fl{float: left;}
.fr{float: right;}
.mr0{margin-right: 0 !important;}
.bd0{border-width: 0 !important;}
.rps{display: block;max-width: 100%;}
.container, .wrapper, .box{position: relative;}
.container:after, .wrapper:after, .box:after, .clearfix:after{content: "";display: block;clear: both;}
html, body{height: 100%;overflow: hidden;user-select: none;-webkit-user-select: none;-moz-user-select: none;}

/****************************** Icon Sprite ******************************/
.category .side ul li a,
.category .close:before,
.nav a:before,
.popup .close{background-image: url("../img/icon.png");background-repeat: no-repeat;}


/* 背景图片 */
.container{position: absolute;top: 50%;left: 50%;width: 1920px;height: 1080px;margin: -540px 0 0 -960px;-webkit-transition: all .8s;transition: all .8s;}
.container .background img{position: absolute;top: 0;left: 0;width: 100%;}
.container .background img.top{z-index: 10;}

/* 圆点 */
.dot{position: absolute;top: 0;left: 0;z-index: 20;width: 100%;height: 100%;-webkit-transition: all .3s ease-in;transition: all .3s ease-in;}
.dot li{position: absolute;display: none;width: 20px;height: 20px;background: rgba(17, 186, 253, 0.4);border-radius: 50%;opacity: .5;cursor: pointer;-webkit-animation: dot 3s;animation: dot 3s;-webkit-animation-iteration-count: infinite;animation-iteration-count: infinite;}
.dot li:after{position: relative;content: "";display: block;width: 10px;height: 10px;margin: 5px auto;background: rgba(17, 186, 253, 0.8);border-radius: 50%;}

/* 指示箭头 */
.arrow{position: absolute;z-index: 20;display: none;cursor: pointer;}
.arrow img{display: block;width: 50px;height: 50px;-webkit-animation: arrow 2s;animation: arrow 2s;-webkit-animation-iteration-count: infinite;animation-iteration-count: infinite;}
.arrow img.view{animation: none;-webkit-animation: none;width: 35px;height: 35px;}
.arrow .tooltip{z-index: 40;display: none;line-height: 28px;padding: 0 15px;background: rgba(0, 0, 0, .7);border-radius: 15px;font-size: 13px;color: #fff;}
.arrow .tooltip.offset{position: relative;left: -20px;top: 10px;}

/* 弹出窗口 */
.popup{position: absolute;top: 50%;left: 50%;z-index: 30;display: none;width: 1000px;height: 460px;border: 5px solid rgba(255, 255, 255, .4);-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%);}
.popup-lock{position: absolute;top: 20%;left: 14%;z-index: 30;display: none;}

.popup:before{position: absolute;top: 0;left: 0;content: "";width: 100%;height: 100%;background: rgba(0, 0, 0, .65);}
.popup-lock:before{position: absolute;top: 0;left: 0;content: "";width: 100%;height: 100%;}
.popup-lock .close,.popup .close{position: absolute;top: 30px;right: 35px;width: 21px;height: 21px;background-position: -65px -65px;}
.popup ul{position: relative;padding: 30px 30px 0;height: 385px;}
.popup-lock ul{position: relative;padding: 180px 370px 0;height: 385px;}
.popup ul li,.popup-lock ul li{display: none;overflow: hidden;}
.popup-lock  ul li p.text{     margin: 60px 5px 0 5px;width: 200px;color: #2ca;}
.popup-lock ul li img{float: left;width: 80px;height: 80px;margin-top: 45px;}
.popup ul li img{float: left;width: 450px;height: 450px;margin-top: 45px;}
.popup ul li .text{float: left;width: 430px;margin-left: 30px;}
.popup ul li .text h2{line-height: 20px;margin-bottom: 20px;font-size: 16px;color: #fff;text-align: center;}
.popup ul li .text p{line-height: 28px;font-size: 13px;color: #fff;word-break: break-all;}
.popup ul li .text em{display: block;width: 50px;margin: 15px 0;border-bottom: 1px solid #fff;}
.popup ul li .text a{float: right;font-size: 14px;color: #fff;letter-spacing: 1px;}
.popup ul li .text a:hover{color: #e60012;}
.popup .btn{position: absolute;right: 30px;bottom: -45px;overflow: hidden;line-height: 32px;background: #333;cursor: pointer;font-size: 13px;color: #fff;text-align: center;letter-spacing: 1px;}
.popup .btn a{border: 1px solid rgba(255, 255, 255, .4);float: left;width: 170px;line-height: 32px;background: #333;cursor: pointer;font-size: 13px;color: #fff;text-align: center;letter-spacing: 1px;border-bottom: none;}
.popup .btn a.active{background: #fff;color: #333;border-color: #fff;}

/* 导航按钮 */
.nav{position: absolute;bottom: 30px;left: 0;z-index: 40;}
.nav a{float: left;line-height: 36px;cursor: pointer;font-size: 14px;color: #333;letter-spacing: 2px;}
.nav a.home{width: 96px;background: url("../img/btn-home.png") no-repeat;}
.nav a.back{width: 97px;margin-left: -12px;background: url("../img/btn-back.png") no-repeat;}
.nav a:before{content: "";display: inline-block;width: 20px;height: 20px;vertical-align: -5px;}
.nav a.home:before{margin: 0 5px 0 18px;background-position: -115px -64px;}
.nav a.back:before{margin: 0 6px 0 24px;background-position: -165px -65px;}

/* 栏目 */
.category{position: absolute;top: 0;left: 0;z-index: 50;display: none;width: 100%;height: 100%;background: rgba(0, 0, 0, .5);}
.category .side{float: left;width: 22%;height: 100%;padding-left: 50px;box-sizing: border-box;background: #000;}
.category .side .logo{display: block;margin: 40px 0;max-width: 100%;}
.category .side ul li{margin-top: 50px;overflow: hidden;}
.category .side ul li label,.category .side ul li en{font-size: 16px;color: #fff;height: 34px;width: 80px;line-height: 17px;}

.category .side ul li a{border: 1px solid #555;border-radius: 5px;-webkit-transition: all .3s;transition: all .3s;display: block;width: 45px;height: 32px;background-position: center;float: left;margin-right: 20px;}
.category .side ul li a:hover{border-color: #fff;box-shadow: 0 0 5px #fff;}
.category .side ul li:nth-of-type(1) a{background-position: -3px -10px;}
.category .side ul li:nth-of-type(2) a{background-position: -53px -8px;}
.category .side ul li:nth-of-type(3) a{background-position: -103px -8px;}
.category .side ul li:nth-of-type(4) a{background-position: -153px -8px;}
.category .side ul li:nth-of-type(5) a:nth-of-type(1){background-position: -203px -8px;}
.category .side ul li:nth-of-type(5) a:nth-of-type(2){background-position: -203px -8px;}
.category .side ul li:nth-of-type(6) a{background-position: -253px -8px;}
.category .side ul li:nth-of-type(7) a{background-position: -303px -10px;}

.category .plan{float: left;width: 78%;height: 100%;background: url("../img/plan.png") no-repeat center / 95% auto;}
.category .close{position: absolute;top: 46px;right: 80px;cursor: pointer;font-size: 16px;color: #fff;}
.category .close:before{content: "";display: inline-block;width: 21px;height: 21px;margin-right: 5px;vertical-align: -5px;background-position: -15px -65px;}

/* 内嵌页面 */
iframe{position: absolute;top: 0;left: 0;z-index: 100;opacity: 0;width: 100%;height: 100%;border: none;}


/****************************** CSS3 Animation *****************************/
@-webkit-keyframes dot {
	50% {
		-webkit-transform: scale(1.2);
		opacity: 1;
	}
}
@keyframes dot {
	50% {
		transform: scale(1.2);
		opacity: 1;
	}
}

@-webkit-keyframes arrow {
	50% { -webkit-transform: translate(-5px, -5px);}
}
@keyframes arrow {
	50% { transform: translate(-5px, -5px);}
}